import React from 'react'
import { InputNumber, Tooltip } from 'antd'
import style from './Index.module.less'

// 获取数字中文单位
function getCnUnit (v) {
  const list = ['个', '十', '百', '千', '万', '十万', '百万', '千万', '亿', '十亿', '百亿', '千亿', '兆', '十兆', '百兆', '千兆']
  if (!v) {
    return list[0]
  }
  const money = String(Math.floor(v))
  return list[money.length - 1]
}

// 金钱输入框
function Main ({ value, placeholder, onChange, config, disabled }) {
  const input = (
    <div className={style['money-input']}>
      <InputNumber
        value={value}
        className={style['number-input']}
        placeholder={placeholder}
        maxLength={16}
        disabled={disabled}
        min={0}
        onChange={v => {
          onChange(v)
        }}
      />
      <span className={style['money-unit']}>{getCnUnit(value)}</span>
    </div>
  )
  if (config.placeholder) {
    return (
      <Tooltip title={config.placeholder} placement='topLeft' trigger='focus'>
        {input}
      </Tooltip>
    )
  }
  return input
}

export default Main
